{% extends "topnav.html"%}

{% block title %}
业务录入
{% endblock %}

<body>
{% block body %}
<div class="container-fluid ">
    <div class="col-sm-2">
        <div class="menus">
            <div class="item">
                <div class="header" onclick="clickMe(this);">业务处理</div>
                <div class="content hide">
                    <a href="{{url_for('sm.insert')}}">--业务录入</a>
                    <a href="{{url_for('sm.process')}}">--业务审批</a>
                    <a href="{{url_for('sm.search')}}">--业务查询</a>
                    <a>--使用说明</a>
                </div>
            </div>
            <div class="item">
                <div class="header" onclick="clickMe(this);">信息与沟通</div>
                <div class="content hide">
                    <a>--查询分析</a>
                    <a>--公告通知</a>
                    <a>--系统说明</a>
                    <a>--数据导出</a>
                </div>
            </div>
        </div>
    </div>
    <div class="col-sm-10">
        <div class="panel panel-info">
            <div class="panel-heading">
                <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>
                您刚才的操作：
                {% for message in get_flashed_messages() %}
                {{ message }}
                {% endfor %}
            </div>
            <div class="flex-container">
                    <form method="post" action="/sm/add_statement">
                        {{ add_statement_form.csrf_token() }}
                        <div class="row">
                            <div class="col-xs-6">
                                <label>{{add_statement_form.jobnumber.label}}：</label><input type="text"
                                                                                          name="jobnumber"
                                                                                          placeholder="请输入工号">
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-xs-6">
                                <label>{{add_statement_form.who.label}}：</label><input type="text"
                                                                                          name="who"
                                                                                          placeholder="请输入姓名">
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-xs-6">
                                <label>{{add_statement_form.amount.label}}：</label><input type="text"
                                                                                          name="amount"
                                                                                          placeholder="请输入金额">
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-xs-12">
                                <label>{{add_statement_form.reason.label}}：</label><input type="text"
                                                                                      name="reason"
                                                                                      placeholder="请输入未使用公务卡原因">
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-xs-6">
                                {{ add_statement_form.submit() }}
                            </div>
                        </div>
                    </form>
            </div>
            <div class="panel panel-info">
                <div class="panel-heading">
                    <span class="glyphicon glyphicon-th-list" aria-hidden="true"></span>
                    待处理现金支付说明列表
                </div>
                <div class="panel-body">
                    注意: 以下是已暂存或被退回的现金支付说明
                </div>
                <div>
                    <table class="table table-hover">
                        <thead>
                        <tr>
                            <th>单号</th>
                            <th>说明人</th>
                            <th>金额</th>
                            <th>原因</th>
                            <th>状态</th>
                            <th>录入时间</th>
                            <th>录入人</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        {%for statement in statements%}
                        <tr>
                            <td>{{statement.id}}</td>
                            <td>{{statement.name}}</td>
                            <td>{{statement.amount}}</td>
                            <td>{{statement.reason}}</td>
                            <td>{{statement.status}}</td>
                            <td>{{statement.input_time}}</td>
                            <td>{{statement.inputer}}</td>
                            <td>
                                <a class="btn btn-primary btn-xs"
                                   href="{{url_for('sm.submit',statement_id=statement.id)}}">提交</a>
                                <a class="btn btn-danger btn-xs"
                                   href="{{url_for('sm.delete',statement_id=statement.id)}}">删除</a>
                            </td>
                        </tr>
                        {% endfor %}
                        </tbody>
                    </table>
                    <nav aria-label="Page navigation">
                        <ul class="pagination">
                            <li>
                                <a href="#" aria-label="Previous">
                                    <span aria-hidden="true">&laquo;</span>
                                </a>
                            </li>
                            <li><a href="#">1</a></li>
                            <li><a href="#">2</a></li>
                            <li><a href="#">3</a></li>
                            <li><a href="#">4</a></li>
                            <li><a href="#">5</a></li>
                            <li>
                                <a href="#" aria-label="Next">
                                    <span aria-hidden="true">&raquo;</span>
                                </a>
                            </li>
                        </ul>
                    </nav>
                </div>
            </div>
            <div class="panel panel-info">
                <div class="panel-heading">
                    <span class="glyphicon glyphicon-th-list" aria-hidden="true"></span>
                    已处理现金支付说明列表
                </div>
                <div class="panel-body">
                    以下是已经处理完的现金支付说明
                </div>
                <div>
                    <table class="table table-hover">
                        <thead>
                        <tr>
                            <th>单号</th>
                            <th>说明人</th>
                            <th>金额</th>
                            <th>原因</th>
                            <th>状态</th>
                            <th>录入人</th>
                            <th>提交人</th>
                            <th>审批人</th>
                            <th>操作时间</th>
                        </tr>
                        </thead>
                        <tbody>
                        {%for submitted_statement in submitted_statements%}
                        <tr>
                            <td>{{submitted_statement.id}}</td>
                            <td>{{submitted_statement.name}}</td>
                            <td>{{submitted_statement.amount}}</td>
                            <td>{{submitted_statement.reason}}</td>
                            <td>{{submitted_statement.status}}</td>
                            <td>{{submitted_statement.inputer}}</td>
                            <td>{{submitted_statement.submitter}}</td>
                            <td>{{submitted_statement.approver}}</td>
                            <td>{{submitted_statement.approve_time}}</td>
                        </tr>
                        {% endfor %}
                        </tbody>
                    </table>
                    <nav aria-label="Page navigation">
                        <ul class="pagination">
                            <li>
                                <a href="#" aria-label="Previous">
                                    <span aria-hidden="true">&laquo;</span>
                                </a>
                            </li>
                            <li><a href="#">1</a></li>
                            <li><a href="#">2</a></li>
                            <li><a href="#">3</a></li>
                            <li><a href="#">4</a></li>
                            <li><a href="#">5</a></li>
                            <li>
                                <a href="#" aria-label="Next">
                                    <span aria-hidden="true">&raquo;</span>
                                </a>
                            </li>
                        </ul>
                    </nav>
                </div>
            </div>
        </div>
</div>
        <script src="../static/js/jquery-3.7.0.min.js"></script>
        <script src="../static/plugins/bootstrap-3.4.1/js/bootstrap.min.js"></script>

        <script type="text/javascript">
            function clickMe(self) {
                var hasHide = $(self).next().hasClass("hide");
                if (hasHide) {
                    $(self).next().removeClass("hide");
                } else {
                    $(self).next().addClass("hide");
                }
            }
        </script>

        <script>
            var currentTime = new Date();
            var year = currentTime.getFullYear();
            var month = (currentTime.getMonth() + 1).toString().padStart(2, '0');
            var date = currentTime.getDate().toString().padStart(2, '0');
            var hour = currentTime.getHours().toString().padStart(2, '0');
            var minute = currentTime.getMinutes().toString().padStart(2, '0');

            var defaultValue = year + '-' + month + '-' + date + 'T' + hour + ':' + minute;
            document.getElementById("input_time").value = defaultValue;
        </script>

        {% endblock %}
    </div>
</body>

